<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>game</title>
		<meta name="viewport" content="width=640,target-densitydpi=device-dpi,maximum-scale=1.0, user-scalable=no">
		<link rel="stylesheet" type="text/css" href="../../css/common/common.css" />
		<link rel="stylesheet" type="text/css" href="css/common/game.css" />
	</head>

	<body>
		<!--背景-->
		<div class="beijing">
			<!--能量条-->
			<div class="nengliangtiao">
				<img src="../../img/result/progress_bg.png" class="liang" />
				<div class="nengliang"></div>
			</div>

			<!--瓶子-->
			<div class="donghua">
				<div class="pingzi"><img src="../../img/game/big_pingzi.png" /></div>
				<img src="img/big_pingzi.png" class="flash1" />
				<img src="img/big_pingzi.png" class="flash2" />
				<img src="img/big_pingzi.png" class="flash3" />
				<img src="img/big_pingzi.png" class="flash4" />
				<img src="img/big_pingzi.png" class="flash5" />
				<img src="../../img/game/hurry.png" class="hurry1" />
				<img src="../../img/game/hurry.png" class="hurry2" />
				<img src="../../img/game/hurry.png" class="hurry3" />
				<img src="../../img/game/hurry.png" class="hurry4" />
				<img src="../../img/game/hurry.png" class="hurry5" />
			</div>

			<!--炸弹-->
			<div class="boom">
				<!--<img src="../../img/game/boom.png" />-->
				<div class="boom_x"></div>
			</div>
			
			<audio src="../../music/music.mp3" id="music"></audio>
		</div>
      
      
      
      
		<script src="../../js/jquery-2.1.js"></script>
		<script src="../../js/deviceMotionHandler.js"></script>
        <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
        
        
        
		<script>
			//自动播放
			function autoPlayAudio() {
				wx.config({
					// 配置信息, 即使不正确也能使用 wx.ready
					debug: false,
					appId: '',
					timestamp: 1,
					nonceStr: '',
					signature: '',
					jsApiList: []
				});
				wx.ready(function() {
					var globalAudio = document.getElementById("music");
					globalAudio.play();
				});
			};
			// 解决ios音乐不自动播放的问题
			autoPlayAudio();
			
			
			
			

			$(".donghua").click(function() {
				//摇动，触发倒计时
				if(daotimeIntval == null) {
					daotimeIntval = setInterval(setDaotime, 1000);
				}
			})
			is_liuzi = false;
			var power = 0,
				totalPower = 6000,
				daotime = 10,
				powerBarWidth = 449,
				progress_bar = $(".nengliang"),
				daotimeIntval = null
			YaoCiShu = 0; //摇晃次数
			window.addEventListener('devicemotion', function(e) {
				deviceMotionHandler(e, function() {
					if(daotimeIntval == null) {
						daotimeIntval = setInterval(setDaotime, 1000);
						$(".boom").addClass("active");
						$(".pingzi").addClass("active_1");
						$(".flash1").addClass("active_2");
						$(".flash2").addClass("active_2");
						$(".flash3").addClass("active_2");
						$(".flash4").addClass("active_2");
						$(".flash5").addClass("active_2");
						$(".hurry1").addClass("active_3");
						$(".hurry2").addClass("active_3");
						$(".hurry3").addClass("active_3");
						$(".hurry4").addClass("active_3");
						$(".hurry5").addClass("active_3");
						
					}
					power += 100;
					if(power > totalPower) {
						power = totalPower;
					}
					var tmp = (power / totalPower);

					progress_bar.css({
						width: tmp * powerBarWidth
					});

					YaoCiShu++;
				});

			}, false);
			

			//倒计时
			function setDaotime() {
				var tmp = (power / totalPower);
				
				
				daotime -= 1;
				if(daotime <= 0) {
					clearInterval(daotimeIntval);
                  if(tmp * powerBarWidth < 100){
                  	window.location.href = "../result/result_1.html";
                  }else if(tmp * powerBarWidth>=100 && tmp * powerBarWidth<200){
                  	window.location.href = "../result/result_2.html";
                  }else if(tmp * powerBarWidth>=200 && tmp * powerBarWidth<400){
                  	window.location.href = "../result/result_3.html";
                  }else if(tmp * powerBarWidth>=440){
                  	window.location.href = "../result/result_4.html";
                  }
				}
			}
		</script>
	</body>

</html>